<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>表格</title>
</head>
<style>
*{
	/*padding: 0;*/
	margin: 0;
}
td{
	/*padding: 10px;*/
}
tr{
	padding: 10px;
}
body{
	height: 100%;
}
table tr:nth-child(odd){
	background: red
}
table tr:nth-child(even){
	background: yellow
}
table tr:nth-child(3){
	background: black
}
table tr:hover{
	background: #fff;
}
</style>
<body>
	<!-- &nbsp;hn p br u i b s pre span div img ol ul li dt dd  -->
	div+css布局
	表格：组织结构化的信息
		单元格按顺序排列而成
		hr-img-table width
		自动按内容平均分配宽度
		cellspacing:单元格间距
		cellpadding:单元格内间距 *padding:0导致这一属性不生效。。。
		background支持。。。
		colspan 单元格跨行
		rowspan 单元格跨列

		table tr:n-th-child(odd)
		n-th-child(even)
		https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/table
		废弃：align(margin) bgcolor(background-color) border(in css) cellspacing(table border-spacing) cellpading(td th padding) valign(废弃)
		...
		...
		caption 表格标题 col 列 colgroup 列祖 tbody td table-cell tfoot th thead定义列 tr...
		border-collapse:separate.默认值：边框会分开，不会忽略border-spacing/collapse：忽略border-spacing empty-cells/inherit
		border-spacing:table下的样式
		caption-side top bottom 表格之上、下
		empty-cells hide 不在空单元格周围绘制边框 show 绘制边框 
		table-layout automatic 列宽由单元格内容设定 fixed 列宽由表格和列宽设定 inherit 

		<hr>
		<div style="height: 500px">		
		<table border="2px" height=100% cellspacing="0px" cellpadding="30px"  align="center" style="margin:auto;width: 800px;padding:30px">
			<thead></thead>
			<tr width:90% style="text-align: center;height: 130px;vertical-align: bottom;width:400px">
				<td>12</td>
				<td>21</td>
				<td rowspan="2">212</td>
				<td colspan="2" >1212</td>
			</tr>
			<tr style="text-align: center;">
				<td>3131</td>
				<td valign="top" height="100px">312312</td>
				<td colspan="2" style="-webkit-column-span: 3;
				-moz-column-span: 3;
				-o-column-span: 3;
				column-span: 3;">31231</td>
				<td>3131</td>
				<td>3131</td>
			</tr>
			<tr>
				<td>3131</td>
				<td>312312</td>
				<td>31231</td>
				<td>3131</td>
				<td>31fds31</td>
				<td>31fds31</td>
			</tr>
			<tr>
				<td>3131</td>
				<td>312312</td>
				<td>31231</td>
				<td>3131</td>
				<td>31fds31</td>
				<td>31fds31</td>
			</tr>
		</table>
</div>
	<div style="height:1100px;"></div>
	 <a href="#">#空链接</a> 页面调到最上面
	<a href="javascript:none;">js空链接</a>
</body>
</html>